<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>display学习</title>
</head>
<body>
    <div style="background-color:red;display:inline">原本div是独占一行，用了display变成独占一格了</div>
    <span style="background-color:red;display:block">原本span是只占一格，用了display变成独占一行了</span>
    <br />
    <span style="display:inline-block;background-color:red;width:500px;height:50px">原本span只会占用自己的原本大小，当加上dispaly的inline-block属性后，可以定义width和height的属性，原本是不可以的</span>
    <a style="display:none">用了这个display;none属性会隐藏这个标签，在js下用得非常多</a>
</body>
</html>